<template>
    <div class="contentWeb clear">
        <div class="member_menu">
            <Companyleft active="jobList"/>
        </div>
        <div class="member_right ">
            <div class="personTengt">
                <Companytitle name="招聘职位 " :addbtn="true" @addform="addform"/>
                <el-table
                        :data="tableData"
                        stripe
                        style="width: 100%;" >
                    <el-table-column
                            width="200"
                            prop="positionName"
                            label="职位"
                    >
                    </el-table-column>
                    <el-table-column
                            prop="wageRange"
                            label="薪资"
                    >
                    </el-table-column>

                    <el-table-column
                            align="center"
                            prop="saveCity"
                            label="工作地区">
                    </el-table-column>
                    <el-table-column
                            align="center"
                            prop="zprs"
                            label="人数">
                    </el-table-column>
                    <el-table-column
                            align="center"
                            prop="experience"
                            label="工作经验">
                    </el-table-column>
                    <el-table-column
                            align="center"
                            prop="educational"
                            label="最低学历">
                    </el-table-column>
                    <el-table-column
                            align="center"
                            prop="recruitState"
                            :formatter="editecruitState"
                            label="招聘状态">
                    </el-table-column>
                    <el-table-column
                            width="130"
                            align="center"
                            prop="createTime"
                            label="发布时间">
                    </el-table-column>
                    <el-table-column width="130"
                            prop="address"
                            align="center"
                            label="操作">
                        <template slot-scope="scope" >
                          <template v-if="scope.row.approval == 2">
                            <el-button type="text" style="color: #20a2b2;" 
                                       @click="updatePositionState(scope.row,2)" v-if="scope.row.recruitState == 1">关闭
                            </el-button>

                            <el-button type="text" style="color: #20a2b2;" size="small"
                                       @click="updatePositionState(scope.row,1)" v-if="scope.row.recruitState == 2">开放
                            </el-button>
                          </template>
                          <el-popover v-else-if="scope.row.approval == 3"
                            placement="bottom"
                            trigger="hover"
                            :content="scope.row.jzyy">
                            <el-button slot="reference" type="text" size="small" style="color:#8d8e9c; margin-right:10px">未通过
                            </el-button>
                          </el-popover>
                            <el-button type="text" size="small" @click="edit(scope.row)" style="color:#20a2b2;">查看
                            </el-button>

                            <el-button type="text" size="small" @click="getdeletejobPosition(scope.row)" style="color:#20a2b2;" v-if="scope.row.recruitState == 2">删除
                            </el-button>
                        </template>
                    </el-table-column>

                </el-table>
                <div v-if="total>0" style="text-align: center; padding: 30px 0">
                    <el-pagination
                            background
                            layout="prev, pager, next"
                            :current-page="search.pageNum"
                            @current-change="getpost"
                            :page-count="totalPages">
                    </el-pagination>
                </div>
            </div>
        </div>
    </div>
</template>
<script type="text/babel">
// @ is an alias to /src

import Companytitle from '../../components/companytitle'
import Upload from '../../components/upload'
import Companyleft from '../../components/companyleft'
import { getPositionByEnterpriseIdShowAll, deletejobPosition, updatePositionState } from '../../assets/js/domains'

export default {
  name: 'JobList',
  components: {
    Companyleft,
    Upload,
    Companytitle
  },
  directives: {},
  data: function () {
    return {
      total: 0,
      totalPages: 0,
      enterInfo: {}, // 企业信息
      search: {
        enterprise_uid: 0,
        pageNum: 1,
        pageSize: 10
      },
      tableData: []
    }
  },
  created: function () {
    document.documentElement.scrollTop = document.body.scrollTop = 0
    this.search.enterprise_uid = localStorage.getItem('md_enterpriseUid')
    this.enterInfo = JSON.parse(localStorage.getItem('md_userInfo') || '{}')
  },
  computed: {},
  mounted: function () {
    this.getpost()
  },
  methods: {
    addform: function () {
      if (this.enterInfo.approval == 1) {
        this.$message.warning('企业信息审核中，暂不能增加职位')
        return
      }
      if (this.enterInfo.approval == 3) {
        this.$message.warning('企业信息未通过审核，不能增加职位')
        return
      }
      this.$router.push({ path: '/addJob' })
    },
    onSubmit: function () {
    },
    edit: function (row) {
      this.$router.push({
        path: '/addJob',
        query: { id: row.id }
      })
    },
    getdeletejobPosition: function (row) {
      const _this = this
      deletejobPosition({ position_id: row.id }).then(function (res) {
        if (res.code === 200) {
          _this.$alert('删除成功', '提示', {
            confirmButtonText: '确定',
            callback: function () {
              _this.search.pageNum = 1
              _this.getpost()
            }
          })
        } else {
          _this.$alert(res.msg, '提示', {
            confirmButtonText: '确定',
            callback: function () {

            }
          })
        }
      })
    },
    updatePositionState: function (row, status) {
      var _this = this
      var _data = { id: row.id, recruitState: status }
      updatePositionState(_data).then(function (res) {
        if (res.code === 200) {
          _this.$alert('操作成功', '提示', {
            confirmButtonText: '确定',
            callback: function () {
              _this.getpost()
            }
          })
        } else {
          _this.$alert(res.msg, '提示', {
            confirmButtonText: '确定',
            callback: function () {

            }
          })
        }
      })
    },
    getpost: function (page) {
      page && (this.search.pageNum = page)
      const _this = this
      getPositionByEnterpriseIdShowAll(this.search).then(function (res) {
        if (res.code === 200) {
          _this.tableData = res.data.content
          _this.total = res.data.totalElements
          _this.totalPages = res.data.totalPages
        } else {
          _this.$alert(res.msg, '提示', {
            confirmButtonText: '确定',
            callback: function () {

            }
          })
        }
      })
    },
    editecruitState: function (row) {
      if(row.approval == 1) return '审核中'
      return row.recruitState == 1 ? '招聘中' : '关闭'
    }
  }
}
</script>
<style lang="less" scoped>
    @import "../../assets/css/member";
</style>
